<%-- 
    Document   : IMatricula
    Created on : 04/09/2013, 02:22:26 PM
    Author     : davis
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
            cargarMatriculaArea();
            cargarMatriculaPago();
            cargarMatriculaFormaPago();
            
            function cargarMatriculaArea(){
                            $.ajax({
                                type : "GET",
                                url : "SCargarArea",
                                success: function(response){
                                    alert("entro");
                               for(var i =0;i<response.length;i++){
                                $("<option value="+i+">"+response[i].area+"</option>").appendTo("#area");
                                     }
                                
                                },
                                error : function(){
                                }

                            });
                 }
                 
                 function cargarMatriculaPago(){
                    $.ajax({
                        type : "GET",
                        url : "SCargarMatriculaFormaPago",
                        success: function(response){
                              $("#pagos").val(response.cuotaUno);
                        },
                        error : function(){
                        }

                    });
                 }
             function cargarMatriculaFormaPago(){
              //   $("#getDetails").click(function(){
              $("#formaPago").change(function(){
                    $.ajax({
                        type : "GET",
                        url : "SCargarMatriculaFormaPago",
                        success: function(response){
                            //alert("valor: "+$('#formaPago>option:selected').text());
                           // alert($("#formaPago").prop("selectedIndex"));
                          
                          if($("#formaPago").prop("selectedIndex")==0)  {
                              $("#pagos").val(response.cuotaUno);
                              
                          } else if($("#formaPago").prop("selectedIndex")==1)  {
                              $("#pagos").val(response.cuotaDos);
                          }
                          else if($("#formaPago").prop("selectedIndex")==2)  {
                              $("#pagos").val(response.cuotaTres);
                              
                          }
                              
                            
                           // $("#employeeName").val(response.name);
                           // $("#employeeFecha").val(response.fecha);
                        },
                        error : function(){
                        }

                    });
                });
                 }
            });
                    
        </script>

        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>Matricular Alumno</title>
        
        
        <style type="text/css">
            .cuerpo
            {
            width:900px;
	    height:300px;
            background-color: aliceblue;
            
            }
        </style>
    </head>
    <body>
       <br/><br/><br/><br/><br/>
        <center>
        <div  class="cuerpo">
            <form >
                <fieldset>
                    <legend>Matricula</legend>
                    <table  border=0 >
                        <tr>
                            <td></td>
                            <td></td>
                            <td>Datos Personales</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td>Datos especificos</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td align="right">Nombres:</td>
                            <td>&nbsp</td>
                            <td width="100"><input type="text" id="nombres" /></td>
                            <td width="100">&nbsp</td>
                            <td align="right">Area a la que postula:</td>
                            <td>&nbsp</td>
                            <td width="180"><select  id="area"></select> Nuevo</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td align="right">Apellido Paterno:</td>
                            <td>&nbsp</td>
                            <td width="100"><input type="text" id="apPaterno" /></td>
                            <td width="100">&nbsp</td>
                            <td align="right">Salon:</td>
                            <td>&nbsp</td>
                            <td width="180"><input type="text" id="salon" readonly="readonly"/></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td align="right">Apellido Materno:</td>
                            <td>&nbsp</td>
                            <td width="100"><input type="text" id="apMaterno" /></td>
                            <td width="100">&nbsp</td>
                            <td align="right">Forma de pago:</td>
                            <td>&nbsp</td>
                            <td><select  id="formaPago">
                                    <option value="1">Todo en I</option>
                                    <option value="2">En  II partes</option>
                                    <option value="3">En III partes</option>
                                </select>
                            </td>
                            <td><input type="text" id="pagos" size="10" readonly="readonly"/></td>
                        </tr>
                        <tr>
                            <td align="right">DNI:</td>
                            <td>&nbsp</td>
                            <td width="100"><input type="text" id="dni" /></td>
                            <td width="100">&nbsp</td>
                            <td align="right"></td>
                            <td>&nbsp</td>
                            <td width="180"></td>
                        </tr>
                        <tr>
                            <td align="right">Telefono</td>
                            <td>&nbsp</td>
                            <td width="100"><input type="text" id="telefono" /></td>
                            <td width="100">&nbsp</td>
                            <td align="right"></td>
                            <td>&nbsp</td>
                            <td width="200"></td>
                        </tr>
                        <tr>
                            <td align="right">E-mail</td>
                            <td>&nbsp</td>
                            <td width="100"><input type="text" id="email" /></td>
                            <td width="100">&nbsp</td>
                            <td align="right"></td>
                            <td>&nbsp</td>
                            <td width="180"></td>
                        </tr>
                         
                    </table>
                    <br/>
                    <br/>
                    <table>
                        <tr>
                            <td align="right">Fecha de Inicio:</td>
                            <td>&nbsp</td>
                            <td width="100"><input type="text" id="fechaInicio" /></td>
                            <td width="50">&nbsp</td>
                            <td align="right">Fecha de Finalizacion:</td>
                            <td>&nbsp</td>
                            <td width="100"><input type="text" id="fechaFinalizacion" /></td>
                        </tr>
                    </table>
                </fieldset>
            </form>
        </div>
        </center>
    </body>
</html>